import React from 'react';
import './style/index.less';

import {Button, Modal} from 'antd';
import BaseComponent from "components/Base/BaseComponent";


class Modal1 extends React.Component {
  state = {visible: false}

  showModal = () => {
    this.setState({
      visible: true,
    });
  }

  handleOk = (e) => {
    console.log(e);
    this.setState({
      visible: false,
    });
  }

  handleCancel = (e) => {
    console.log(e);
    this.setState({
      visible: false,
    });
  }

  render() {
    return (
      <div>
        <Button type="primary" onClick={this.showModal}>Open</Button>
        <Modal
          title="Basic Modal"
          okText='确认'
          cancelText='取消'
          visible={this.state.visible}
          onOk={this.handleOk}
          onCancel={this.handleCancel}
        >
          <p>Some contents...</p>
          <p>Some contents...</p>
          <p>Some contents...</p>
        </Modal>
      </div>
    );
  }
}


export default class DialogDemo extends BaseComponent {

  showConfirm = () => {

    this.showDialog('confirm', {
      title: 'Do you Want to delete these items?',
      content: 'Some descriptions',
      onOk() {
        console.log('OK');
      },
      onCancel() {
        console.log('Cancel');
      },
    });
  }

  render() {
    return (
      <div>
        <Modal1/>
        <Button onClick={this.showConfirm}>
          Confirm
        </Button>
      </div>
    );
  }
}
